<template>
	<view class="m-withmodel">
		<view class="type-item flex-between" v-if="model == 1">
			<u-icon 
				name="photo-fill"
				size="25"
				color="#f2bc35"
				:label="$t('m_withmodel.code')"
				labelColor="#3f2a17"
				labelSize="25rpx"
			>
			</u-icon>
			<view class="flex-between">
				<view class="btn btn-sm radius bg-yellow" v-if="showCode" @click="preView()">{{$t('m_withmodel.look')}}</view>
				<view class="btn btn-sm radius bg-yellow" v-if="showCode" @click="update()">{{$t('m_withmodel.replace')}}</view>
				<view class="btn btn-sm radius bg-yellow" v-if="!showCode" @click="update()">{{$t('m_withmodel.uplate')}}</view>
			</view>
		</view>
		<m-viveimg 
			:show="popupShow" 
			:imgSrc="code"
			@preViewClose="preViewClose"
		>
		</m-viveimg>
	</view>
</template>

<script>
	export default {
		name:"m-withmodel",
		props: ['userId','model','sCode','codeUrl'],
		data() {
			return {
				showCode:this.sCode,
				code:this.codeUrl,
				popupShow:false
			};
		},
		methods:{
			update(){
				var _this = this;
				uni.chooseImage({
				    count: 1, //默认9
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album'], //从相册选择
				    success: async function (res) {
				    	uni.showLoading({title:this.$t('app.uploading')});
						var up = (await User.uploadWithCode(res.tempFilePaths[0])).data;
				    	uni.hideLoading();
						_this.code = res.tempFilePaths[0];
						// console.log(up);
				    	up=JSON.parse(up);
				    	if(up.code==200){
							_this.showCode = true;
							_this.getUserInfo();
				    		uni.showToast({
				    			title:this.$t('app.upload.success')
				    		})
				    	}else{
				    		uni.showToast({
				    			title:up.msg,
				    			icon:'none'
				    		})
				    	}
				    }
				});		
			},
			getUserInfo(){
				this.$emit('getUserInfo');
				// var res = await User.getUserInfo(this.userId);
				// if(res.code == 200){
				// 	uni.setStorageSync('userInfo',res.data)
				// }
			},
			preView(){
				this.popupShow = true;
			},
			preViewClose(){
				this.popupShow = false;
			}
		}
	}
</script>

<style>
	.type-item{
		align-items: center;
		border-radius: 25px;
		padding: 10px;
		background-color: rgba(242,188,53,.1);
		color: #f2bc35;
		
		font-size: 28rpx;
	}
	.viewCode{
		padding: 10px;
		border-radius: 10px;
		overflow: hidden;
		position: relative;
	}
</style>
